<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="/static/css/bootstrap.min.css" rel="stylesheet">
    <link href="/static/bootstrap-table/bootstrap-table.css">
    <script type="text/javascript" src="/static/js/jquery-2.2.4.js"></script>
    <script type="text/javascript" src="/static/bootstrap-table/bootstrap-table.js"></script>

</head>
<body>

<div id="toolbar">
    <button class="btn btn-success" id="addBtn">新增</button>
    <button class="btn btn-warning" id="updateBtn">修改</button>
    <button class="btn btn-danger" id="btnDelete">删除</button>

</div>

<table id="table">
</table>
<script type="text/javascript">

    var $table =  $("#table");
    function del(id){
        $.get("/product/delete?id="+id,
            function(r){
                if(r.code === 1){
                    alert("删除成功");
                    $table.bootstrapTable('refresh');//刷新表格，重新获取新数据
                }else{
                    alert(r.msg);
                }
            });
    }

    $(function(){
        $table.bootstrapTable({
                url:'/product/findAll',//请求地址
                pagination:true, //分页  默认前端分页
                search:true,
                toolbar:"#toolbar",
                columns: [[//field:"pid"  把服务端响应的json，key为pid的字段渲染到该列
                    //每个{}  对应  一列，field:"pid" json的key,title:"编号" 列的标题
                    {checkbox:true},
                    {field:"pid",title:"编号", align: 'center', valign: 'middle'},
                    {field:"pname",title:"商品名称"},
                    {field:"pprice",title:"商品价格"},
                    {field:"pinfo",title:"商品信息"},
                    {field:"ptime",title:"上架时间"
                        // ,formatter:function (value) {
                        //     return new Date(value).toLocaleString();
                        // }
                    },
                    {field:"operation",title:"操作",formatter:function(value,row,index){
                            //row  代表当前行
                            console.log(row);
                            return "<button class='btn btn-danger' onclick='del("+row.pid+")'>删除</button>";
                        }}
                ]]
        });


        $("#addBtn").click(function(){
            location.href="add.html";
        });





    });
</script>
</body>
</html>